import { useEffect, useReducer } from 'react'
import './App.css'
import { AuthContext, authInitiaStarte, authReducer } from './contexts'
import { Header, AddSong } from './components'

function App() {
  const [state, dispatch] = useReducer(authReducer, authInitiaStarte)
  useEffect(() => {
    setTimeout(() => {
      dispatch({
        type: "LOGIN",
        payload: {
          user: {
            name: 'yzx',
            age: 22
          },
          token: {t:'1111223124e'}
        }
      })
    }, 2000);
  }, [])

  return (
    <AuthContext.Provider value={
      {
        state,
        dispatch
      }
    }>
      <Header></Header>
      {state.isAuthenticated && <AddSong></AddSong>}
    </AuthContext.Provider>
  )
}

export default App
